<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
    <link href="../css/bootstrap4x.css" rel="stylesheet"/>
    <link href="../css/common.css" rel="stylesheet">
    <link href="../css/userArea.css" rel="stylesheet">
    <link href="../css/all.min.css" rel="stylesheet">
    <link href="../css/bootstrap-table.css" rel="stylesheet">
    <link href="//at.alicdn.com/t/font_3316096_z1qyfcob3y.css" rel="stylesheet" type="text/css"/>
    <title>Title</title>
</head>
<body style="display: none;">
<div class="container">
    <div id="page_head"></div>
    <div class="userInfo">
        <div class="tx" id="txText">刘</div>
        <div class="user-name-box">
            <span class="user-name" id="userName">刘兆新</span>
            <span class="badge badge-success ml-1">书圣</span>
            <i class="iconfont icon-vip-line"></i>
        </div>
        <div class="user-tag">
            <span class="badge rounded-pill badge-primary">软件工程学院</span>
            <span class="badge rounded-pill badge-primary">软件工程专业</span>
            <span class="badge rounded-pill badge-danger">日阅百卷</span>
        </div>
        <p class="remark">阅读的最大理由是想摆脱平庸，早一天就多一份人生的精彩；迟一天就多一天平庸的困扰。</p>
    </div>
    <div class="row mt-2">
        <div class="col-md-3 left-nav mt-1">
            <div class="sticky-top">
                <div class="title-box">
                    <i class="iconfont icon-daohang"></i>
                    <span>快捷导航</span>
                </div>
                <ul class="list-group">
                    <li class="list-group-item" onclick="changeContent('userInfo')">
                        <i class="iconfont icon-yonghu"></i>
                        我的信息
                    </li>
                    <li class="list-group-item" onclick="changeContent('borrowInfo')">
                        <i class="iconfont icon-shiwujieyue"></i>
                        借阅信息管理
                    </li>
                    <li class="list-group-item" onclick="changeContent('orderInfo')">
                        <i class="iconfont icon-ic_reserve"></i>
                        预定信息管理
                    </li>
                    <li class="list-group-item admin" onclick="changeContent('userM')">
                        <i class="iconfont icon-yonghuguanli_huaban"></i>
                        用户管理
                    </li>
                    <li class="list-group-item admin" onclick="changeContent('bookM')">
                        <i class="iconfont icon-neirongyi"></i>
                        图书管理
                    </li>
                    <li class="list-group-item admin" onclick="changeContent('setting')">
                        <i class="iconfont icon-setting"></i>
                        系统设置
                    </li>
                    <li class="list-group-item admin" onclick="changeContent('log')">
                        <i class="iconfont icon-rizhi"></i>日志维护
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-md-9">
            <div class="menu-content" id="userInfo">
                <div class="title-box mt-2">
                    <i class="iconfont icon-yonghu"></i>
                    <span>我的信息</span>
                </div>
                <div class="mb-3">
                    <table class="table table-hover text-nowrap text-center" id="userInfoT">
                    </table>
                </div>
                <div class="title-box mt-2">
                    <i class="iconfont icon-yonghu"></i>
                    <span>个人二维码</span>
                </div>
                <div id="user_qrcode"></div>
            </div>
            <div class="menu-content" id="borrowInfo">
                <div class="title-box mt-2">
                    <i class="iconfont icon-shiwujieyue"></i>
                    <span>借阅信息管理</span>
                </div>
                <div class="mb-3">
                    <div class="mr-1" id="borrowMT">
                        <button class="btn btn-outline-success" data-target="#borrow_book" data-toggle="modal" >
                            读者借书
                        </button>
                        <button class="btn btn-outline-success" data-target="#return_book" data-toggle="modal">
                            读者还书
                        </button>
                    </div>
                    <table class="table table-hover text-nowrap text-center" id="borrowInfoT"></table>
                </div>
            </div>
            <div class="menu-content" id="orderInfo">
                <div class="title-box mt-2">
                    <i class="iconfont icon-ic_reserve"></i>
                    <span>预定信息管理</span>
                </div>
                <div class="mb-3">
                    <table class="table table-hover text-nowrap text-center" id="orderInfoT"></table>
                </div>
            </div>
            <div class="menu-content" id="userM">
                <div class="title-box mt-2">
                    <i class="iconfont icon-yonghuguanli_huaban"></i>
                    <span>用户管理</span>
                </div>
                <div class="mb-3">
                    <div id="userMTB">
                        <button class="btn btn-outline-success mr-1" data-target="#insert_user" data-toggle="modal"
                                onclick="initUserAdd()">
                            添加用户
                        </button>
                    </div>
                    <table class="table table-hover text-nowrap text-center" id="userMT"></table>
                </div>
            </div>
            <div class="menu-content" id="bookM">
                <div class="title-box mt-2">
                    <i class="iconfont icon-neirongyi"></i>
                    <span>图书管理</span>
                </div>
                <div class="mb-3">
                    <div class="mr-1" id="bookMTB">
                        <button class="btn btn-outline-primary" data-target="#insert_book" data-toggle="modal"
                                onclick="insertBookInit()">
                            添加图书
                        </button>
                    </div>
                    <table class="table table-hover text-nowrap text-center" id="bookMT"></table>
                </div>
            </div>
            <div class="menu-content" id="setting">
                <div class="title-box mt-2">
                    <i class="iconfont icon-setting"></i>
                    <span>系统设置</span>
                </div>
                <div class="row my-2">
                    <label class="col-auto col-form-label text-center">
                        读者最多可借书数：
                    </label>
                    <div class="col-3">
                        <input class="form-control" name="maxBorrownum" type="number" value="15"/>
                    </div>
                </div>
                <div class="row my-2">
                    <label class="col-auto col-form-label text-center">
                        图书借阅期限(天)：
                    </label>
                    <div class="col-3">
                        <input class="form-control" name="maxBorrowdays" type="number" value="30"/>
                    </div>
                </div>
                <div class="row my-2">
                    <label class="col-auto col-form-label text-center">
                        预定有效期限(天)：
                    </label>
                    <div class="col-3">
                        <input class="form-control" name="Estvaldays" type="number" value="7"/>
                    </div>
                </div>
                <button onclick="setting()" class="btn btn-primary ml-2">提交</button>
            </div>
            <div class="menu-content" id="log">
                <div class="title-box mt-2">
                    <i class="iconfont icon-setting"></i>
                    <span>日志维护</span>
                </div>
                <div class="mb-3">
                    <table class="table table-hover text-nowrap text-center" id="logT"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="borrow_book" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">读者借书</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row p-3">
                    <label class="col-auto col-form-label text-center">
                        读入的图书证号：
                    </label>
                    <div class="col-3">
                        <input class="form-control" type="number" name="borrowBookId"/>
                    </div>
                    <label class="col-auto col-form-label text-center">
                        读入的借阅证号：
                    </label>
                    <div class="col-3">
                        <input class="form-control" type="number" name="borrowID"/>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
                <button class="btn btn-primary" data-dismiss="modal" type="button" onclick="addRecord()">借书</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="return_book" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">读者还书</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row p-3">
                    <label class="col-auto col-form-label text-center">
                        图书编号：
                    </label>
                    <div class="col-3">
                        <input class="form-control" type="number" name="delRecordBookId"/>
                    </div>
                    <label class="col-auto col-form-label text-center">
                        借阅证号：
                    </label>
                    <div class="col-3">
                        <input class="form-control" type="number" name="delRecordId"/>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
                <button class="btn btn-primary" data-dismiss="modal" type="button" onclick="delRecord()">还书</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="insert_book" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">图书添加修改</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="input-group mb-3">
                    <span class="input-group-text">图书编号</span>
                    <input class="form-control" name="bookId" placeholder="图书编号" type="text"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">图书名称</span>
                    <input class="form-control" name="bookName" placeholder="图书名称" type="text"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">作者</span>
                    <input class="form-control" name="bookAuthor" placeholder="图书作者" type="text"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">出版者</span>
                    <input class="form-control" name="bookPub" placeholder="图书出版者" type="text"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">单价</span>
                    <input class="form-control" name="bookPrice" placeholder="图书单价" step="0.01" type="number"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">类型</span>
                    <select class="form-control" name="class_">
                        <option value="1">测试</option>
                    </select>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">库存</span>
                    <input class="form-control" min="1" name="bookNum" placeholder="数量" step="1" type="number"/>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">封面链接</span>
                    <input class="form-control" name="imgUrl" type="url"/>
                </div>
                <div class="input-group mb-3">
                    <textarea class="form-control" name="bookDescr" placeholder="图书摘要" rows="3"></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
                <button class="btn btn-primary" data-dismiss="modal" id="bookActionBtn" onclick="addBook()"
                        type="button">提交
                </button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="insert_user">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">用户添加修改</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="input-group mb-3">
                    <span class="input-group-text iconfont icon-xuehao"></span>
                    <input class="form-control" name="stdId" placeholder="学号" type="number">
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text iconfont icon-yonghu"></span>
                    <input class="form-control" maxlength="20" name="username" placeholder="姓名" type="text">
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text iconfont icon-email"></span>
                    <input class="form-control" name="email" placeholder="邮箱" type="email">
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text iconfont icon-shoujihao1"></span>
                    <input class="form-control" name="phone" placeholder="手机号" type="number">
                </div>

                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <i class="iconfont icon-xueyuan input-group-text"></i>
                    </div>
                    <select class="custom-select" id="college" onchange="getProf1()">

                    </select>
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <i class="iconfont icon-zhuanyemingcheng input-group-text"></i>
                    </div>
                    <select class="custom-select" id="prof">
                    </select>
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text iconfont icon-mima"></span>
                    <input class="form-control" name="reg_pwd" placeholder="密码" type="password">
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
                <button class="btn btn-primary" onclick="addUser()" type="button" id="userActionBtn">保存</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="logLooking0">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">借阅信息</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                借阅书籍信息：<br>
                <span class="font-weight-bold">书名：</span>
                <span id="logbookname0" class="text-muted"></span><br>
                <span class="font-weight-bold">作者：</span>
                <span id="logbookauthor0" class="text-muted"></span><br>
                <span class="font-weight-bold">摘要：</span>
                <span id="logbookdesc0" class="text-muted"></span><br>
                <span class="font-weight-bold">价格：</span>
                <span id="logbookprice0" class="text-muted"></span><br>
                <span class="font-weight-bold">出版商：</span>
                <span id="logbookpress0" class="text-muted"></span><br>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="logLooking1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">预定信息</h5>
                <button class="close" data-dismiss="modal" type="button">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                预定书籍信息：<br>
                <span class="font-weight-bold">书名：</span>
                <span id="logbookname1" class="text-muted"></span><br>
                <span class="font-weight-bold">作者：</span>
                <span id="logbookauthor1" class="text-muted"></span><br>
                <span class="font-weight-bold">摘要：</span>
                <span id="logbookdesc1" class="text-muted"></span><br>
                <span class="font-weight-bold">价格：</span>
                <span id="logbookprice1" class="text-muted"></span><br>
                <span class="font-weight-bold">出版商：</span>
                <span id="logbookpress1" class="text-muted"></span><br>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-dismiss="modal" type="button">关闭</button>
            </div>
        </div>
    </div>
</div>
<div aria-live="polite" aria-atomic="true" class="d-flex justify-content-center align-items-center"
     style="height: 200px;">

    <div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
        <div class="toast-header">
            <strong class="mr-auto">Bootstrap</strong>
            <small>11 mins ago</small>
            <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="toast-body">
            Hello, world! This is a toast message.
        </div>
    </div>
</div>
<script>
    // document.addEventListener("DOMContentLoaded", () => {
    //     let mask = document.getElementById("my-mask")
    //     if (mask == null) {
    //         let div = document.createElement("div")
    //         let obj = $(div)
    //         obj.attr("id", "my-mask")
    //         obj.css({
    //             "background": "rgba(0,0,0,0.3)",
    //             "position": "fixed",
    //             "top": "0",
    //             "left": "0",
    //             "width": "100%",
    //             "height": "100%",
    //             "display": "flex",
    //             "align-items": "center",
    //             "justify-content": "center",
    //             "color": "white",
    //             "font-size": "1.20rem",
    //             "font-weight": "600",
    //             "z-index": "9999"
    //         })
    //         obj.html("数据加载中...")
    //         $("body").append(div)
    //     } else {
    //         mask.style.display = "flex"
    //     }
    // });
</script>
<script src="../js/jquery3.6.js"></script>
<script src="../js/jquery-cookie.js"></script>
<script src="../js/md5.js"></script>
<script src="../js/common.js"></script>
<script src="../js/qrcode.js"></script>
<script src="../js/bootstrap4x.js"></script>
<script src="../js/bootstrap-table.js"></script>
<script src="../js/bootstrap-table-zh-cn.js"></script>
<script src="../js/tx1.js"></script>
<script src="../js/tx3.js"></script>
<script>
    // 借阅信息
    var borrowInfoTOptions = {
        toolbar: "#borrowMT",
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        pageSize: 5,
        pagination: true,
        paginationParts: ['pageList'],
        searchAlign: 'left',
        columns: [

            {
                field: 'bookId',
                title: '图书编号'
            }, {
                field: 'bookName',
                title: '图书名'
            }, {
                field: 'borrowId',
                title: '借阅证号'
            }, {
                field: 'readerName',
                title: '读者姓名'
            }, {
                field: 'academy',
                title: '学院'
            }, {
                field: 'major',
                title: '专业'
            }, {
                field: 'startTime',
                title: '借阅时间'
            }, {
                field: 'endTime',
                title: '到期时间'
            }, {
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    actions.push(`<button class="btn btn-outline-primary">续借</button>`)
                    return actions;
                }
            }
        ],
        data: [
            {
                bookId: '010101010101',
                bookName: '查理九世',
                borrowId: '2020081061',
                readerName: 'xiaoRan',
                academy: "软件工程",
                major: "软件工程",
                startTime: '2022-03-21',
                endTime: '2022-04-21'
            }
        ]
    }
    // 用户信息
    var userInfoTOptions = {
        columns: [
            {
                field: 'id',
                title: '借阅证号'
            }, {
                field: 'name',
                title: '读者姓名'
            }, {
                field: 'college',
                title: '学院',
                formatter(value, row) {
                    let data = getCollege()
                    for (let i of data) {
                        if (i["id"] == value) {
                            return i["name"]
                        }
                    }
                    return "xxx"
                }
            }, {
                field: 'professional',
                title: '专业',
                formatter(value, row) {
                    let data = getAllProf()
                    console.log("获取到的 prof", data)
                    for (let i of data) {
                        console.log(i, value)
                        if (i["id"] == value) {
                            return i["name"]
                        }
                    }
                    return "xxx"
                }
            }, {
                field: 'phone',
                title: '联系电话'
            }, {
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    actions.push(`<button class="btn btn-outline-primary" onclick="updateUser('${escape(JSON.stringify(row))}')">编辑资料</button>`)
                    return actions;
                }
            }
        ],
        data: []
    }
    getUserInfo();
    // 借阅信息
    var borrowInfoTOptions = {
        toolbar: "#borrowMT",
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        pageSize: 5,
        pagination: true,
        paginationParts: ['pageList'],
        searchAlign: 'left',
        columns: [
            {
                field: 'bookId',
                title: '图书编号'
            }, {
                field: 'bookName',
                title: '图书名'
            }, {
                field: 'id',
                title: '借阅证号'
            }, {
                field: 'name',
                title: '读者姓名'
            }, {
                field: 'college',
                title: '学院',
                formatter(value, row) {
                    let college;
                    collegeData.forEach(i=>{
                        if(value == i.id){
                            college = i.name
                        }
                    })
                    return college
                }
            }, {
                field: 'professional',
                title: '专业',
                formatter(value, row) {
                    let professional;
                    allProf.forEach(i=>{
                        if(value ==  i.id){
                            professional = i.name
                        }
                    })
                    return professional
                }
            }, {
                field: 'rdDate',
                title: '借阅时间',
                formatter(value, row) {
                    return new Date(value).format("yyyy-MM-dd")
                }
            }, {
                field: 'endDate',
                title: '到期时间',
                formatter(value, row) {
                    if(value < new Date().getTime()){
                        return '已超时'
                    }
                    return new Date(value).format("yyyy-MM-dd")
                }
            }, {
                title: '操作',
                visible: user_info["roles"] == "admin",
                formatter(value, row) {
                    let actions = []
                    actions.push(`<button class="btn btn-outline-primary" onclick="updateRecord(${row.bookId},${row.id})">续借</button>`)
                    return actions;
                }
            }
        ],
        data: []
    }

    // 订阅信息
    var orderInfoTOptions = {
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        pageSize: 5,
        pagination: true,
        paginationParts: ['pageList'],
        searchAlign: 'left',
        columns: [
            {
                field: 'bookId',
                title: '图书编号'
            }, {
                field: 'bookName',
                title: '图书名'
            }, {
                field: 'id',
                title: '借阅证号'
            }, {
                field: 'name',
                title: '读者姓名'
            }, {
                field: 'rdDate',
                title: '预定时间',
                formatter(value, row) {
                    return new Date(value).format("yyyy-MM-dd")
                }
            }, {
                field: 'college',
                title: '学院',
                formatter(value, row) {
                    let college;
                    collegeData.forEach(i=>{
                       if(value == i.id){
                           college = i.name
                       }
                    })
                    return college
                }
            }, {
                field: 'professional',
                title: '专业',
                formatter(value, row) {
                    let professional;
                    allProf.forEach(i=>{
                        if(value ==  i.id){
                            professional = i.name
                        }
                    })
                    return professional
                }
            }, {
                field: 'num',
                title: '数量',
                visible: false
            }, {
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    actions.push(`<button class="btn btn-outline-primary" onclick="deleteBooking(${row.bookId},${row.id})">解除预定</button>`)
                    return actions;
                }
            }
        ],
        data: []
    }
    // 用户管理
    var userMTOptions = {
        toolbar: "#userMTB",
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        pageSize: 6,
        pagination: true,
        paginationParts: ['pageList'],
        searchAlign: 'left',
        columns: [
            {
                field: 'id',
                title: '借阅证号'
            }, {
                field: 'name',
                title: '读者姓名'
            }, {
                field: 'college',
                title: '学院',
                formatter(value, row) {
                    let data = getCollege()
                    for (let i of data) {
                        if (i["id"] == value) {
                            return i["name"]
                        }
                    }
                    return "xxx"
                }
            }, {
                field: 'professional',
                title: '专业',
                formatter(value, row) {
                    let data = getAllProf()
                    console.log("获取到的 prof", data)
                    for (let i of data) {
                        console.log(i, value)
                        if (i["id"] == value) {
                            return i["name"]
                        }
                    }
                    return "xxx"
                }
            }, {
                field: 'phone',
                title: '联系电话'
            }, {
                field: 'email',
                title: '邮箱'
            }, {
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    let banText = "禁用"
                    let color_dfn = "btn-outline-danger"
                    let is = true;
                    if (row.status == 0) {
                        banText = "启用"
                        color_dfn = "btn-outline-success"
                        is = false;
                    }
                    actions.push(`<button class="btn ${color_dfn}" onclick="banUser('${row.id}', '${is}')">${banText}</button>`)
                    actions.push(`<button class="btn btn-outline-primary" onclick="updateUser('${escape(JSON.stringify(row))}')">修改</button>`)
                    return actions.join(" ");
                }
            }
        ],
        data: []
    }
    // 图书管理
    var bookMTOptions = {
        toolbar: '#bookMTB',
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        searchAlign: 'left',
        pageSize: 6,
        pagination: true,
        paginationParts: ['pageList'],
        columns: [
            {
                field: 'bookCover',
                title: "封面图",
                formatter(value, row) {
                    return `<img src="${value}" width="60" height="80" alt="..."/>`;
                }
            },
            {
                field: 'bookId',
                title: '图书编号'
            }, {
                field: 'bookName',
                title: '图书名'
            }, {
                field: 'author',
                title: '作者'
            }, {
                field: 'publisher',
                title: '出版者'
            }, {
                field: 'bookPrice',
                title: '单价'
            }, {
                field: 'descr',
                title: '摘要'
            }, {
                field:'data',
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    actions.push(`<button class="btn btn-outline-danger" onclick="delBook('${row.bookId}')">删除</button>`)
                    actions.push(`<button class="btn btn-outline-primary" onclick="updateBook('${escape(JSON.stringify(row))}')">修改</button>`)
                    return actions.join(" ");
                }
            }
        ],
        data: []
    }
    // 日志维护
    var logOptions = {
        showColumns: true,
        showRefresh: true,
        showSearchButton: true,
        showToggle: true,
        search: true,
        pageNumber: 1,
        pageSize: 5,
        pagination: true,
        searchAlign: 'left',
        paginationParts: ['pageList'],
        columns: [
            {
                field: 'rd_date',
                title: '日期',
                formatter(value, row) {
                    return new Date(value).format("yyyy-MM-dd");
                }
            }, {
                field: 'name',
                title: '读者姓名'
            }, {
                field: 'type',
                title: '类型',
                formatter(value, row) {
                    if(value==0)
                        return "预定";
                    return "借阅";
                }
            }, {
                title: '操作',
                formatter(value, row) {
                    let actions = []
                    if(row.type==1)
                        actions.push(`<button class="btn btn-outline-primary" onclick="log0(${value.bookId})">查看借阅信息</button>`)
                    else
                        actions.push(`<button class="btn btn-outline-primary" onclick="log1(${value.bookId})">查看预定信息</button>`)
                    console.log(actions)
                    return actions.join(" ");
                }
            }
        ],
        data: [
        ]
    }
    // 用户信息
    var userInfo;
    // 初始化区域 start
    menuKz()
    changeContent('userInfo')
    tableAction(borrowInfoTOptions, 'borrowInfoT', 'init');
    editPlaceholder('borrowInfo', '图书编号/图书名/...');
    tableAction(orderInfoTOptions, 'orderInfoT', 'init');
    editPlaceholder('orderInfo', '图书名/借阅证号');
    editPlaceholder('userM', '借阅证号/读者姓名/...');
    editPlaceholder('bookM', '图书名/出版者/作者/...');

    getBookingList();
    getRecordList();
    renderBookList();
    getCategory();
    getAllUserData();
    getCollege1();
    renderlog()
    // 初始化区域 end
    function log0(bookId) {
        $("#logLooking0").modal("show")
        $.ajax({
            url: "http://localhost:8080/book",
            data: {
                key:"getBook",
                bookId:bookId,
            },
            success(data) {
                if (data.code === 10001) {
                    console.log(data,"ddddddddd")
                    $("#logbookname0").text(data.data.bookName)
                    $("#logbookauthor0").text(data.data.author)
                    $("#logbookdesc0").text(data.data.descr)
                    $("#logbookprice0").text(data.data.bookPrice)
                    $("#logbookpress0").text(data.data.publisher)
                }
            }
        })
    }
    function log1(bookId) {
        $("#logLooking1").modal("show")
        $.ajax({
            url: "http://localhost:8080/book",
            data: {
                key:"getBook",
                bookId:bookId,
            },
            success(data) {
                if (data.code === 10001) {
                    console.log(data,"ddddddddd")
                    $("#logbookname1").text(data.data.bookName)
                    $("#logbookauthor1").text(data.data.author)
                    $("#logbookdesc1").text(data.data.descr)
                    $("#logbookprice1").text(data.data.bookPrice)
                    $("#logbookpress1").text(data.data.publisher)
                }
            }
        })
    }
    function renderlog(){
        console.log(logdata, "jjjjjj")
        tableAction(logOptions, 'logT', 'refresh',logdata);
    }

    // 执行用户修改
    function submitUserEdit() {
        let fdata = {
            name: $("input[name=username]").val(),
            email: $("input[name=email]").val(),
            phone: $("input[name=phone]").val(),
            stdId: $("input[name=stdId]").val(),
            pwd: $("input[name=reg_pwd]").val(),
            college: $("#college option:selected").val(),
            professional: $("#prof option:selected").val(),
            key: "updateUser"
        }
        if (check(fdata)) {
            fdata.pwd = null
            // success
            $.ajax({
                url: "http://localhost:8080/reader",
                data: fdata,
                method: "post",
                success(data) {
                    console.log(data)
                    if (data.code === 10001) {
                        console.log("用户修改成功");
                        alert("用户修改成功")
                        $("#insert_user").modal("hide")
                        if (user_info["roles"] === "admin") {
                            tableAction(userMTOptions, 'userMT', "refresh", getUserList())
                        }
                        let su = getUser(fdata["stdId"])
                        tableAction(userInfoTOptions, 'userInfoT', "init", [su])

                    } else {
                        alert("用户修改失败")
                    }
                },
                error(XMLHttpRequest, textStatus, errorThrown) {
                    alert("用户修改失败 ")
                    console.log("ajax 请求失败");
                }
            })
        } else {
            // fail
        }
    }

    // 修改用户
    function updateUser(user) {
        let curUser = JSON.parse(unescape(user))
        $("input[name=stdId]").attr("disabled", "true")
        $("input[name=username]").val(curUser["name"])
        $("input[name=email]").val(curUser["email"])
        $("input[name=phone]").val(curUser["phone"])
        $("input[name=reg_pwd]").attr("disabled", "true")
        $("input[name=reg_pwd]").val("xxxxxxxx")
        $("input[name=stdId]").val(curUser["id"])
        $("#college").val(curUser["college"])
        let data = getProf(curUser["college"])
        let htmlStr = "<option selected value=\"0\">请选择专业</option>"
        for (let i of data) {
            if (i["id"] == curUser["professional"]) {
                htmlStr += `<option value="${i["id"]}" selected>${i["name"]}</option>`
            } else {
                htmlStr += `<option value="${i["id"]}">${i["name"]}</option>`
            }
        }
        $("#prof").html(htmlStr)
        $("#userActionBtn").attr("onclick", "submitUserEdit()")
        $("#insert_user").modal("show")
    }


    // 获取专业
    function getProf1() {
        let cid = $("#college").val()
        let data = getProf(cid)
        let htmlStr = "<option selected value=\"0\">请选择专业</option>"
        for (let i of data) {
            htmlStr += `<option value="${i["id"]}">${i["name"]}</option>`
        }
        $("#prof").html(htmlStr)
    }

    // 获取 college
    function getCollege1() {
        let data = getCollege()
        let htmlStr = "<option selected value=\"0\">请选择学院</option>"
        for (let i of data) {
            htmlStr += `<option value="${i["id"]}">${i["name"]}</option>`
        }
        $("#college").html(htmlStr)
    }

    // 初始化用户添加
    function initUserAdd() {
        $("input[name=stdId]").removeAttr("disabled")
        $("input[name=reg_pwd]").removeAttr("disabled")
        $("input[name=reg_pwd]").val("")
        $("input[name=username]").val("")
        $("input[name=email]").val("")
        $("input[name=phone]").val("")
        $("input[name=stdId]").val("")
        $("#college").val(collegeData[0]["id"])
        $("#prof").val("")
        $("#userActionBtn").attr("onclick", "addUser()")
    }

    //  新增用户
    function addUser() {
        let data = {
            name: $("input[name=username]").val(),
            email: $("input[name=email]").val(),
            phone: $("input[name=phone]").val(),
            stdId: $("input[name=stdId]").val(),
            pwd: $("input[name=reg_pwd]").val(),
            college: $("#college option:selected").val(),
            professional: $("#prof option:selected").val(),
            key: "register"
        }
        if (check(data)) {
            // success
            $.ajax({
                url: "http://localhost:8080/reader",
                data: data,
                method: "post",
                success(data) {
                    console.log(data)
                    if (data.code === 10001) {
                        console.log("用户添加成功");
                        alert("用户添加成功")
                        $("#insert_user").modal("hide")
                        tableAction(userMTOptions, 'userMT', "refresh", getUserList())
                    } else {
                        alert("用户添加失败")
                    }
                },
                error(XMLHttpRequest, textStatus, errorThrown) {
                    alert("注册失败")
                    console.log("ajax 请求失败");
                }
            })
        } else {
            // fail
        }
    }

    // 图书新增初始化
    function insertBookInit() {
        $("input[name=bookId]").val("")
        $("input[name=bookName]").val("")
        $("input[name=bookAuthor]").val("")
        $("input[name=bookPub]").val("")
        $("input[name=bookPrice]").val("")
        $("textarea[name=bookDescr]").val("")
        $("select[name=class_]").val(allCategory[0]["cid"])
        $("input[name=bookNum]").val("")
        $("input[name=imgUrl]").val("")
        $("input[name=bookId]").removeAttr("disabled")
        $("#bookActionBtn").attr("onclick", "addBook()")
    }

    // 修改图书
    function updateBook(book) {
        let curBook = JSON.parse(unescape(book))
        // // 填数据进去
        $("input[name=bookId]").val(curBook["bookId"])
        $("input[name=bookId]").attr("disabled", "true")
        $("input[name=bookName]").val(curBook["bookName"])
        $("input[name=bookAuthor]").val(curBook["author"])
        $("input[name=bookPub]").val(curBook["publisher"])
        $("input[name=bookPrice]").val(curBook["bookPrice"])
        $("textarea[name=bookDescr]").val(curBook["descr"])
        $("select[name=class_]").val(curBook["class_"])
        $("input[name=bookNum]").val(curBook["num"])
        $("input[name=imgUrl]").val(curBook["bookCover"])
        $("#bookActionBtn").attr("onclick", "submitBookEdit()")
        $("#insert_book").modal("show")
    }

    // 更新图书
    function submitBookEdit() {
        let data = {
            bookId: $("input[name=bookId]").val(),
            bookName: $("input[name=bookName]").val(),
            author: $("input[name=bookAuthor]").val(),
            pub: $("input[name=bookPub]").val(),
            price: $("input[name=bookPrice]").val(),
            descr: $("textarea[name=bookDescr]").val(),
            class_: $("select[name=class_]").val(),
            num: $("input[name=bookNum]").val(),
            imgUrl: $("input[name=imgUrl]").val(),
            key: "updateBook"
        }
        console.log(data);
        $.ajax({
            url: "http://localhost:8080/book",
            data: data,
            success(data) {
                if (data.code === 10001) {
                    console.log("成功")
                    alert("修改成功")
                    tableAction(bookMTOptions, 'bookMT', "refresh", getBookList())
                }
            }
        })
    }

    // 删除图书
    function delBook(id) {
        $.ajax({
            url: "http://localhost:8080/book",
            data: {
                key: "delBook",
                bookId: id
            },
            method: "post",
            success(data) {
                if (data.code === 10001) {
                    alert("删除成功");
                    tableAction(bookMTOptions, 'bookMT', "refresh", getBookList())
                }
            }
        })

    }

    // 禁用用户
    function banUser(id, is) {
        $.ajax({
            url: "http://localhost:8080/reader",
            data: {
                key: "banUser",
                id: id,
                is: is
            },
            success(data) {
                if (data.code === 10001) {
                    if (is == "true") {
                        alert("禁用成功")
                    } else {
                        alert("启用成功")
                    }
                    tableAction(userMTOptions, 'userMT', "refresh", getUserList())
                } else {
                    alert("操作失败")
                }
            }
        })
    }

    // 菜单项控制
    function menuKz() {
        console.log("权限", user_info["roles"]);
        if (user_info["roles"] === "admin") {
            for (let i of $('.admin')) {
                console.log(i, "test")
                $(i).css("display", "block")
            }
        }
    }

    function showFileName(file) {
        $("#filename_label").html(file.name);
    }

    // 获取图书类别
    function getCategory() {
        let data = getAllCategory()
        let htmlStr = ""
        for (let i of data) {
            htmlStr += `<option value="${i["cid"]}">${i["cname"]}</option>`
        }
        $("select[name=class_]").html(htmlStr)
    }

    // 添加图书
    function addBook() {
        let data = {
            bookId: $("input[name=bookId]").val(),
            bookName: $("input[name=bookName]").val(),
            author: $("input[name=bookAuthor]").val(),
            pub: $("input[name=bookPub]").val(),
            price: $("input[name=bookPrice]").val(),
            descr: $("textarea[name=bookDescr]").val(),
            class_: $("select[name=class_]").val(),
            num: $("input[name=bookNum]").val(),
            imgUrl: $("input[name=imgUrl]").val(),
            key: "addBook"
        }
        console.log(data);
        $.ajax({
            url: "http://localhost:8080/book",
            data: data,
            success(data) {
                if (data.code === 10001) {
                    console.log("成功")
                    alert("添加成功")
                    tableAction(bookMTOptions, 'bookMT', "refresh", getBookList())
                }
            }
        })
    }

    // 获取所有用户信息
    function getAllUserData() {
        tableAction(userMTOptions, 'userMT', "init", g_userList)
    }

    // 获取用户信息
    function getUserInfo() {
        let user_info = $.cookie("user_info")
        if (user_info !== undefined) {
            console.log(user_info);
            userInfo = JSON.parse(user_info)
            $("#txText").text(userInfo["name"].substring(0, 1))
            $("#userName").text(userInfo["name"])
            // 用户信息表格渲染
            tableAction(userInfoTOptions, 'userInfoT', "init", [getUser(userInfo["id"])])
            // 生成个人二维码
            qrcode("user_qrcode", "http://" + ip_host + "/reader?key=getReaderById&id=" + userInfo["id"])
        } else {
            confirm("未登录，请先登录")
            location.href = '../index.html'
        }
    }

    //系统设置
    function setting() {
        let data = {
            key: "maxBorrownum",
            val: $("input[name=maxBorrownum]").val()
        }
        $.ajax({
            url: "http://localhost:8080/configuration",
            data: data,
            method: "post",
            success(data) {
                console.log("HRZ",data);
                if(data.data == 1){
                    alert("修改成功")
                }
            },
            error(XMLHttpRequest, textStatus, errorThrown) {
                console.log("ajax 请求失败");
            }
        })
        data = {
            key: "maxBorrowdays",
            val: $("input[name=maxBorrowdays]").val()
        }
        $.ajax({
            url: "http://localhost:8080/configuration",
            data: data,
            method: "post",
            success(data) {
                console.log(data);
            },
            error(XMLHttpRequest, textStatus, errorThrown) {

                console.log("ajax 请求失败");
            }
        })
        data = {
            key: "Estvaldays",
            val: $("input[name=Estvaldays]").val()
        }
        $.ajax({
            url: "http://localhost:8080/configuration",
            data: data,
            method: "post",
            success(data) {
                console.log(data);
            },
            error(XMLHttpRequest, textStatus, errorThrown) {

                console.log("ajax 请求失败");
            }
        })
    }

    //获取预定表单
    function getBookingList() {
        tableAction(orderInfoTOptions, 'orderInfoT', 'init', BookingList)
    }

    //获取借阅表单
    function getRecordList(){
        tableAction(borrowInfoTOptions,'borrowInfoT','init',RecordList)
    }

    //解除预定
    function deleteBooking(bookId, id) {
        let data = {
            "bookId": bookId,
            "id": id,
            "key": "deleteBooking"
        }
        $.ajax({
            url: "http://localhost:8080/booking",
            data: data,
            method: "post",
            success(data) {
                if (data.code == 10001) {
                    console.log("解除预定成功！")
                    alert("解除预定成功！")
                } else {
                    console.log("解除预定失败! ")
                    alert("解除预定失败！")
                }
            }
        })
    }

    //续借
    function updateRecord(bookId,id){
        let data= {
            "bookId":bookId,
            "id":id,
            "key":"updateRecord"
        }
        $.ajax({
            url: "http://localhost:8080/recorder",
            data: data,
            method: "post",
            success(data) {
                if (data.code == 10001) {
                    console.log("续借成功！")
                    alert("续借成功！")
                } else {
                    console.log("续借失败! ")
                    alert("续借失败！")
                }
            }
        })
    }

    //借书
    function addRecord(){
        let bookId = $("input[name=borrowBookId]").val()
        let id = $("input[name=borrowID]").val()
        let data = {
            "bookId":bookId,
            "id":id,
            "key":"addRecord"
        }
        $.ajax({
            url: "http://localhost:8080/recorder",
            data: data,
            method: "post",
            success(data) {
                if (data.code == 10001) {
                    console.log("借书成功！")
                    alert("借书成功！")
                } else {
                    if(data.msg == "该书不存在"){
                        alert("该书不存在")
                    }else if(data.msg == "该用户不存在" ){
                        alert("该用户不存在")
                    }else if(data.msg == "已借阅最大本数"){
                        alert("已达最大借阅本数")
                    }else {
                        alert("已借阅该图书")
                    }
                }
            }
        })
    }

    //还书
    function delRecord(){
        let bookId = $("input[name=delRecordBookId]").val()
        let id = $("input[name=delRecordId]").val()
        let data = {
            "bookId":bookId,
            "id":id,
            "key":"delRecord"
        }
        $.ajax({
            url: "http://localhost:8080/recorder",
            data: data,
            method: "post",
            success(data) {
                if (data.code == 10001) {
                    console.log("还书成功！")
                    alert("还书成功！")
                } else {
                    if(data.msg == "该书不存在"){
                        alert("该书不存在")
                    }else{
                        alert("该用户不存在")
                    }
                }
            }
        })
    }

    // 获取图书列表
    function renderBookList() {
        tableAction(bookMTOptions, 'bookMT', "init", g_bookList)
    }

    // 菜单项切换
    function changeContent(id) {
        for (var item of $('.menu-content')) {
            var par = $(item)
            if (par.attr('id') === id) {
                par.css("display", "block");
            } else {
                par.css("display", "none")
            }
        }
        document.body.style.display = "block"
    }

    // action => init 初始化 refresh 刷新 destroy 销毁 rebuild 重建 data [{},{}...]
    function tableAction(options = {}, tableId, action, data = []) {
        let obj = $('#' + tableId);
        switch (action) {
            case 'init':
                obj.bootstrapTable(options);
                obj.bootstrapTable('load', data);
                break;
            case 'destroy':
                obj.bootstrapTable('destroy');
                break;
            case 'refresh':
                console.log("ces")
                obj.bootstrapTable('destroy');
                obj.bootstrapTable(options);
                obj.bootstrapTable('load', data);
        }
    }

    // 修改搜索框提示信息
    function editPlaceholder(id, content) {
        let data = $('#' + id).find('input[type=search]');
        if (data.length > 0) {
            $(data[0]).attr('placeholder', content);
        }
    }

</script>
</body>
</html>
